<template>
    <div>
        <div class="info-form">
            <el-form :model="addForm" :inline="true">
                <el-form-item>
                    <el-select v-model="value"
                               filterable
                               allow-create
                               placeholder="请选择或输入考试描述"
                               class="goodstype-input">
                        <el-option

                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="getScore()">提交</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div>
            <el-table
                    :data="tableData"
                    show-summary
                    stripe
                    style="width: 100%">
                <el-table-column
                        :filters="ename"
                        :filter-method="filterEname"
                        filter-placement="bottom-end"
                        prop="ename"
                        label="考试科目">
                </el-table-column>
                <el-table-column
                        :filters="uname"
                        :filter-method="filterUname"
                        filter-placement="bottom-end"
                        prop="uname"
                        label="考试人员">
                </el-table-column>
                <el-table-column
                        prop="score"
                        label="分数">
                </el-table-column>
                <el-table-column label="操作">
                    <template scope="scope">
                        <el-button @click="handleClick(scope.$index)" type="text" size="small">录入分数</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-dialog title="录入分数" :visible.sync="dialogFormVisible">
                <el-form>
                    <el-form-item label="分数" :label-width="formLabelWidth">
                        <el-input v-model="score" auto-complete="off"></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="setScore">确 定</el-button>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

<script>
    import moment from 'moment';
    import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item";
    export default {
        components: {ElFormItem}, data() {
            return {
                options: [],
                uname: [],
                ename: [],
                value: '',
                value1: '',
                addForm: {},
                tableData: [],
                score: 0,
                sid: '',
                dialogFormVisible: false,
                formLabelWidth: '120px',
                pickerOptions0: {
                    disabledDate(time) {
                        return time.getTime() < Date.now() - 8.64e7;
                    }
                },
            }
        },
        activated(){
            this.getExamDescription();

        },
        methods: {
            getScore(){
                let self = this;
                this.tableData = [];
                let desid = this.value.examdescription_id;
                this.$axioxs.get("/score/getScoreByDate?desid=" + desid)
                    .then(function (res) {
                        self.tableData = res.data.records;
                        let arr = [];
                        let ayy = [];
                        self.uname = [];
                        self.ename = [];
                        res.data.records.forEach(item => {
                            if (arr.indexOf(item.uname) < 0) {
                                arr.push(item.uname);
                                let a = {};
                                a.text = item.uname;
                                a.value = item.uname;
                                self.uname.push(a);
                            }
                            if (ayy.indexOf(item.ename) < 0) {
                                ayy.push(item.ename);
                                let a = {};
                                a.text = item.ename;
                                a.value = item.ename;
                                self.ename.push(a);
                            }
                        })
                    })
            },
            getExamDescription(){
                let self = this;
                this.options = []
                this.$axioxs.get("/exam/getDes")
                    .then(function (res) {
                        let i = res.data.records;
                        i.forEach(item => {
                            let j = {}
                            j.value = item;
                            j.label = moment(item.examTime).format("YYYY-MM-DD") + item.examdescription;
                            self.options.push(j);
                        })

                    })
            },
            handleClick(index) {
                this.dialogFormVisible = true;
                this.sid = this.tableData[index].id;
            },
            setScore(){
                let self = this;
                this.$axioxs.post("/score/save?sid=" + this.sid + "&score=" + this.score)
                    .then(function (res) {
                        self.dialogFormVisible = false;
                        self.score = 0;
                        self.sid = '';
                        self.getScore();
                    })
            },
            filterUname(value, row) {
                return row.uname === value;
            },
            filterEname(value, row) {
                return row.ename === value;
            }
        }
    }
</script>